@import 'openmina';

:host {
  display: flex;
  flex-direction: column;
}

.tree-map {
  height: calc(50vh - 2px);
  border: 0.5px solid $base-tertiary;
  overflow: hidden;

  @media (max-width: 768px) {
    height: calc(30vh - 2px);
  }
}

:host ::ng-deep svg {
  text, rect.child-bg, path.chevron {
    visibility: hidden;
    opacity: 0;
    transition: opacity 200ms;

    &.see {
      visibility: visible;
      opacity: 1;
    }

    &.child-count {
      font-weight: 600;
    }
  }
}
